<template>
	<view class="can">
		<view class="can-wrapper" v-for="(item,index) in noticeList" :key="index">
			<view class="can-header">
				<view class="can-title">{{item.title}}</view>
				<view class="can-text" v-html="item.info"></view>
			</view>
			<view class="can-time">{{item.dates}}</view>
			<view class="can-info"  @click="hanldInfo(item)">
				<view class="info-text">查看详情</view>
				<image src="/static/img/right_lan.png"></image>
			</view>
		</view>
		
		<view v-if="loadAll&&noticeList.length>=10" class="no-more-data">没有更多了</view>
		<view v-if="noticeList.length == 0" class="no-more-data">
		  暂无数据
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				noticeList:[],
				page:1,
				loadAll:false
			}
		},
		onPullDownRefresh() {
		  // console.log('下拉刷新')
		  this.loadAll = false;
		  this.noticeList = [];
		  this.page = 1;
		  this.getNotice();
		},
		onReachBottom() {
		  console.log('上拉加载')
		  if (!this.loadAll) {
		    this.getNotice();
		  }
		},
		onLoad(){
			this.getNotice()
		},
		methods: {
			getNotice(){
				this.$http.annou({type:2,page: this.page}).then(res => {
					uni.stopPullDownRefresh()
					if(res.data){
						let _list = res.data.data
						let totalPage = res.data.last_page
						if (this.page > totalPage || _list.length == 0) {
						  this.loadAll = true
						  return
						}
						if(_list.length > 0){
						  this.noticeList = this.noticeList.concat(_list);
						  if(this.noticeList && this.noticeList.length>0){
							  this.noticeList.forEach((val) => {
							  	val.info = this.$utils.formatRichText(val.info)
							  })
						  }
						}
						this.page++;
					}
				})	
			},
			hanldInfo(item){
				uni.navigateTo({
					url:'noticeInfo?detail='+JSON.stringify(item)
				})
			},
		}
	}
</script>

<style scoped>
	.can-wrapper:nth-of-type(1) {
		margin-top:0px;
	}
.can-wrapper{
	background:rgba(248,248,248,1);
	border-radius:20upx;
	padding: 14px;
	margin-top: 14px;
}
.can{
	width: 100%;
	margin: 15px;
}
.can-info{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	border-top: 1px solid #E5EBF1;
	padding-top: 15px;
}
.can-info image{
	width: 10px;
	height: 17px;
}
.can-title{
	color: #242424;
	font-size: 15px;
	font-weight: bold;
}
.can-text{
	color: #4D4D4D;
	font-size: 13px;
	padding: 12px 0 8px 0;
}
.can-time{
	color: #B8B9BE;
	text-align: right;
	padding-bottom: 10px;
}
.info-text{
	color: #3E9AFC;
	font-size: 15px;
	font-weight: bold;
}
</style>
